---
id: 615f4172e9eec061d6456221
title: Schritt 19
challengeType: 0
dashedName: step-19
---

# --description--

Die Nährwertkennzeichnungen haben eine Menge fettgedruckten Text, um die Aufmerksamkeit auf die wichtigen Informationen zu lenken. Anstatt jedes Element auszuwählen, das fettgedruckt sein muss, ist es effizienter, eine Klasse zu verwenden, um den fettgedruckten Stil auf jedes Element anzuwenden.

Gib deinem zweiten `p`-Element ein `class`-Attribut mit dem Wert `bold`.

# --hints--

Dein zweites `p`-Element sollte ein `class`-Attribut mit dem Wert `bold` enthalten.

```js
assert(document.querySelectorAll('p')?.[1]?.classList?.contains('bold'));
```

Dein zweites `p`-Element sollte kein `class`-Attribut mit dem Wert `bold` enthalten.

```js
assert(!document.querySelector('p')?.classList?.contains('bold'));
```

# --seed--

## --seed-contents--

```html
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Nutrition Label</title>
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800" rel="stylesheet">
  <link href="./styles.css" rel="stylesheet">
</head>

<body>
--fcc-editable-region--
  <div class="label">
    <h1>Nutrition Facts</h1>
    <div class="divider"></div>
    <p>8 servings per container</p>
    <p>Serving size 2/3 cup (55g)</p>
  </div>
--fcc-editable-region--
</body>
</html>
```

```css
* {
  box-sizing: border-box;
}

html {
  font-size: 16px;
}

body {
  font-family: 'Open Sans', sans-serif;
}

.label {
  border: 2px solid black;
  width: 270px;
  margin: 20px auto;
  padding: 0 7px;
}

h1 {
  font-weight: 800;
  text-align: center;
  margin: -4px 0;
  letter-spacing: 0.15px;
}

p {
  margin: 0;
}

.divider {
  border-bottom: 1px solid #888989;
  margin: 2px 0;
}
```
